/**
 * @Author: easten
 * @Created: 2024-09-20 00:06:52
 * @Description: 加脂机的相关配置
 *
 */
import { IotDeviceConfig } from "_common/entity";
import React, { useEffect, useState } from "react";
import { Form, InputNumber, Switch } from "tdesign-react";
import FormItem from "tdesign-react/es/form/FormItem";
type GreaseConfigProps = {
  config?: IotDeviceConfig;
};

// 报警配置的子配置
type SubConfigType = {
  dtCode: number;
  enabled: boolean;
  config: TempConfig | VoltageConfig | CountConfig;
};

// 温度的配置
type TempConfig = {
  alarmValue: number; // 超过这个值进行报警
};
// 电压的配置
type VoltageConfig = {
  alarmValue: number; // 低于这个值进行报警
};

// 加脂次数的配置
type CountConfig = {
  // 规格1，规格1的报警值 250ml
  alarmValue: number;
  // 规格2，规格2的报警值 500ml
  alarmValue2: number;
  // 规格3，规格3的报警值
  alarmValue3: number;
  // 规格4，规格4的报警值
  alarmValue4: number;
  // 规格5，规格5的报警值
  alarmValue5: number;
};

const GreaseConfig: React.FC<GreaseConfigProps> = (
  props: GreaseConfigProps
) => {
  const { config } = props;
  const [deviceConfig, setDeviceConfig] = useState<IotDeviceConfig>();
  const [subConfig, setSubConfig] = useState<SubConfigType[]>();

  useEffect(() => {
    setDeviceConfig(config);
  }, [config]);
  return (
    <div className="mt-10">
      <Form
        labelWidth={150}
        onValuesChange={(_, values) => {
          console.log("values:", values);
        }}
      >
        <FormItem label="设备离线间隔" name="offlineSpan">
          <InputNumber value={deviceConfig?.offlineSpan} />
        </FormItem>
        <FormItem label="历史数据保存间隔" name="saveSpan">
          <InputNumber value={deviceConfig?.saveSpan} />
        </FormItem>
        <FormItem label="报警数据保存频率" name="frequency">
          <InputNumber value={deviceConfig?.frequency} />
        </FormItem>
      </Form>
      <div>
        <span>温度：</span>
        <Switch defaultValue={deviceConfig?.temperature} />
      </div>
    </div>
  );
};
export default GreaseConfig;
